import { request } from "@/utils/request";
import { PagedDataResponse, ArticleInfo } from "@/type";
import ArticleList from "./ArticleList";
import Pager from "@/components/Pager";

type PageProps = {
  searchParams?: Promise<{ page?: string }>;
};

export default async function page({ searchParams }: PageProps) {
  const urlParams = (await searchParams) ?? {};
  const pageConfig = {
    page: Number(urlParams.page) || 1,
    pageSize: 10,
    total: 0,
  };
  const query = new URLSearchParams({
    type: "1",
    page: "1",
    pageSize: "10",
  }).toString();
  const res = await request<PagedDataResponse<ArticleInfo>>(
    `/articles?${query}`
  );
  const articleList = res?.data.list ?? [];
  pageConfig.total = res?.data.total ?? 0;
  return (
    <div className="w-full md:w-[80vw] lg:w-[60vw] xl:w-[50vw] mx-auto">
      <div className="my-3 md:my-6 text-lg md:text-[30px]">全部文章</div>

      <ArticleList articleList={articleList} />

      <div className="mb-10 flex justify-end">
        <Pager
          pageConfig={{
            page: pageConfig.page,
            pageSize: pageConfig.pageSize,
            total: pageConfig.total,
          }}
        />
      </div>
    </div>
  );
}
